<template>
  <div>
    <!-- 头部tab -->
    <!-- <div class="top_tab">
      <div class="left" @click="back()">
        <img  src="../assets/order_center/shangs.png">
      </div>
      <span>直购委托鸿包</span>
      <div class="right">
      </div>
    </div> -->
		<!-- <div class="kong"></div> -->
    <div class="list">
			<div class="boxt">
				<div class="info" @click="show11 = true">
					<span>类型</span><input disabled type="text" v-model="zhi" placeholder="1000 现金+9000 鸿包">
				</div>
			</div>
			<div class="boxt">
				<div class="info">
					<span>委托份数</span><input v-model="num" type="text" placeholder="请输入委托份数">
				</div>
			</div>
			<div class="btn">
				<button class="affirm" @click="isOk()" >确认</button>
				<button class="cancel" @click="back()">取消</button>
			</div>
		</div>
		<!-- 解债师资格 -->
		<div class="center">
			<div class="bar">
				<div class="title">
					<div class="box">
						<div class="f"></div>
						<span>温馨提示</span>
						<div class="f"></div>
					</div>
				</div>
				<div class="tt"> 
					<div class="fk">
						<span>1元现金=1个债权鸿包</span>
					</div>
					<div class="fk">
						<span>1000元现金+9000债权鸿包=10000元现金</span>
						<span>&lt;六年左右还款&gt;</span>
					</div>
					<div class="fk">
						<span>2000元现金+8000债权鸿包=10000元现金</span>
						<span>&lt;三年左右还款&gt;</span>
					</div>
					<div class="fk">
						<span>3000元现金+7000债权鸿包=10000元现金</span>
						<span>&lt;两年左右还款&gt;</span>
					</div>
					<div class="fk">
						<span>委托鸿包份数</span>
					</div>
					<div class="fk">
						<span>例如:5份×（1000元现金+9000债权鸿包）=</span>
						<span>5000元+45000债权鸿包=50000元</span>
					</div>
				</div>
			</div>
		</div>


		  <!-- 弹出选择 -->
     <yd-popup v-model="show11" position="center" width="90%">
        <div class="bodys">
            <div v-for="(item,index) in val" :key="index" @click="clickshui(item)"><span>{{item}}</span></div>
        </div>
    </yd-popup>
	</div>
</template>

<script>
export default {
  name: 'Pokemon',
  data () {
    return {
		zhi:'',
		show11:false,
		num:'',
		val:[
			'1000元现金+9000债权鸿包=10000元现金',
			'2000元现金+8000债权鸿包=10000元现金',
			'3000元现金+7000债权鸿包=10000元现金',
		],
    }
  },
  methods:{
    back: function() {
      this.$router.go(-1);
	},
	clickshui(v){
      this.show11 = false;
      this.zhi = v;
      console.log(v)
	},
	isOk(){
		let self = this;
		if(!this.zhi){
        	this.$dialog.toast({mes:'请选择类型'});
       	 return
		}
		if(!this.num){
       		 this.$dialog.toast({mes:'请输入委托份数'});
        return
		}
		let url ="/api/entrustcheck";
		self.httpPost(url,{token:this.token,user_id:this.myid,price:this.price,debtnum:this.debtnum,type:0,num:this.num},function(res) {
		if (res.code === 200) {
			self.$dialog.toast({mes:res.msg});
			setTimeout(() => {
				self.$router.go(-1);
			}, 1000);
        }else{
     	   self.$dialog.toast({mes:res.msg});
		}
      })
	}
  },
	created(){
   		document.title = "委托申请";
   		this.token = localStorage.getItem('mytoken');
		this.myid = localStorage.getItem('myid');
  }
}
</script>


<style scoped>
.top_tab{
  width:100%;
  padding:.2rem .3rem;
  background: #FFF;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-shadow: .01rem .01rem .06rem #ddd;
  margin-bottom: .03rem;
  position: fixed;
}
.kong{
	width:100%;
	height:.92rem;
}
.top_tab span{
  color:#333;
  font-size: .36rem;
}
.top_tab .right{
	width: 1rem;
	display: flex;
	justify-content: space-between;
}
.top_tab  img{
  width:.43rem;
}
.list{
	width:100%;
	padding: 0 .3rem;
	background: #FFF;
}
.list .boxt{
	width:100%;
	height:1rem;
	background: #FFF;
	display: flex;
	align-items: center;
	
}
.list .boxt .info{
	width:100%;
	height:100%;
	display: flex;
	align-items: center;
	line-height: 1.4rem;
	border-bottom: 1px solid #eee;
}

.list .boxt .info span{
	font-size: .28rem;
	color:#707070;
}
.boxt span{
	font-size: .28rem;
	color:#333;
}
.boxt input{
	border:none;
	margin-left:.2rem;
	flex: 1;
}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { 
	color: #9e9e9e; 
	margin-left: .2rem;
} 
input:-moz-placeholder, textarea:-moz-placeholder { 
	color: #9e9e9e;
	margin-left: .2rem; 
} 
input::-moz-placeholder, textarea::-moz-placeholder { 
	color: #9e9e9e;
	margin-left: .2rem; 
} 
input:-ms-input-placeholder, textarea:-ms-input-placeholder { 
	color: #9e9e9e; 
	margin-left: .2rem;
} 
.btn{
	width:100%;
	display: flex;
	justify-content: center;
	padding: .2rem .2rem;
}
.btn .affirm{
	width: 1.18rem;
	height:.60rem;
	background: #e63f3f;
	border: none;
	border-radius: 5px;
	font-size: .28rem;
	color:#FFF;
}
.btn .cancel{
	width: 1.18rem;
	height:.60rem;
	background: #e7e6e9;
	border: none;
	border-radius: 5px;
	font-size: .28rem;
	color:#adadad;
	margin-left: .5rem;
}
.center{
	width:100%;
	height:12.1rem;
	margin-top: .2rem;
	background: #FFF;
	padding: .3rem .65rem;
	display: flex;
	justify-content: center;
}
.center .bar{
	width:100%;
	height:7.3rem;
	display: flex;
	flex-direction: column;
	border:1px solid #d2d2d2;
	border-radius: 20px;
	padding: .3rem .1rem;;
}
.center .bar .title{
	width:100%;
	display: flex;
	justify-content: center;
}
.center .bar .title .box{
	width:1.93rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.center .bar .title .box .f{
	width:.1rem;
	height:.1rem;
	background:#ee8834;
}
.center .bar .title .box span{
	font-size: .30rem;
	color:#ee8834;
}
.center .bar .tt{
	width:100%;
	height:5.5rem;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	margin-top: .7rem;
	padding: 0 .2rem;
}
.center .bar .tt .fk{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.center .bar .tt .fk span{
	color:#a0a0a0;
	font-size: .26rem;
	text-align: center;
	line-height: .4rem;
}
.bodys{
    background: white;
    border-radius: 5px;
    padding: .3rem;
    max-height: 6rem;
    overflow: hidden;
    overflow-y: scroll;
}
.bodys div{
    color: #333;
    line-height:.8rem;
    border-bottom: 1px solid #dfdfdf;
    font-size: .3rem;
    padding-left: .2rem;
    display: flex;
    justify-content: space-between;
}
.fexx div p{
    margin-top: .1rem;
}
</style>



